import { onMounted } from "vue"
import { useRoute,onBeforeRouteUpdate } from 'vue-router'
import { reactive } from 'vue'
import { getTopCategoryAPI } from '@/apis/category'

export function useCategory() {
    const route = useRoute()
    const category = reactive({})

    const getCategory = async (id) => {
        const { result } = await getTopCategoryAPI(id)
        Object.assign(category,result)  
    }

    onMounted(() => {
        getCategory(route.params.id)
    })

    onBeforeRouteUpdate((to) => {
        getCategory(to.params.id)
    })
    
    return { category }
}